<%@page contentType="text/html; charset=UTF-8" language="java" %>
<html>
<head>test</head>
<body>

<button id="test">click me to go to test</button>

<a id="index" href="index.jsp">Index</a>
<a id="dataLoadManage" href="/menu/dataLoadManage">dataLoadManage</a>
<a id="dataQuery" href="/menu/dataQuery">dataQuery</a>
<a id="dataSetManage" href="/menu/dataSetManage">dataSetManage</a>
<a id="dataSetExample" href="/menu/dataSetExample">dataSetExample</a>


<button id="xhhuang" onclick="func1()">Click me to show dialog</button>
<button id="testButton" onclick="func2()">Click me to add list</button>

<p id="output" style="color:red">Hello</p>

<p id="test2" style="color: forestgreen;">Remained Part</p>


<form action="${pageContext.request.contextPath}/db/connect" method="post" id="dbInfoForm">
  数据库连接驱动：<input type="text" name="dbDriver" id="dbDriver" /> <br><br>
  数据连接地址：<input type="text" name="dbUrl" id="dbUrl"/> <br><br>
  数据库用户名：<input type="text" name="dbUserName" id="dbUserName" /> <br><br>
  数据库密码：<input type="text" name="dbPasswd" id="dbPasswd" /> <br><br>
  数据库：<input type="text" name="dataBase" id="dataBase" /> <br><br>
  <input type="submit" value="提交"/>
</form>



  SQL语句：<input type="text" name="sqlSentence" id="sqlSentence" /> <br><br>
  <input type="submit" value="提交" onclick="testDBInfor()"/>

</body>




<script src="/js/jquery-2.1.4.js"></script>
<script>
    function testDBInfor() {
        var sqlSentence=$("#sqlSentence").val();
        $.ajax({
            type: "POST",
            url: "/db/executeSQL",
            traditional: true,
            //async: false, //同步方式提交
            data: {"sqlSentence": sqlSentence},
            success: function (response) {
                var rhtml = response.code + ":"
                $.each(response.data, function (index, result) {
                    '<h3>' + result.id + result.teamName
                    '</h3>';
                })
                $("#test2").html(rhtml);
            },
            error: function () {
                alert("不好意思 出错了error occured!!!");
            }
        })

    }

    function submitDBInfo() {
        var driver = $("#dbDriver").val().trim();
        var url = $("#dburl").val().trim();
        var username = $("#dbusername").val().trim();
        var passwd = $("#dbpasswd").val().trim();
        var database = $("#database").val().trim();

        $.ajax({
            type: "POST",
            url: "db/connect",
            traditional: true,
            async: false, //同步方式提交
            data: {"dbDriver": driver, "dbUrl": url, "dbUserName": username, "dbPasswd:": passwd, "dataBase": database},
            success: function () {

            },
            error: function () {
                alert("不好意思 出错了error occured!!!");
            }

        })
    }

    function func1() {
        $.ajax({
            type: "POST",
            url: 'menu/getInfoTest',
            traditional: true,
            async: false,
//            dataType: "json",
            success: function (data) {
                $("#output").html(data);
            },
            error: function () {
                alert("不好意思 出错了error occured!!!");
            }
        })

//        $.get('/menu/getInfoTest/',null,function (data) {
//          alert(data);
//         });
    }

    function func2() {
        $.ajax({
            type: "POST",
            url: "/menu/test2",

            success: function (response) {
                var rhtml=response.code+":";
                $.each(response.data, function(index, result){
                    rhtml+='<h3>' + result.name+':'+result.size + '</h3>';
                })
                $("#test2").html(rhtml);
            }

        })
    }
</script>
</html>